<template>
	<view class="box-theme-item-more">
		<image class="the-image" src="http://139.9.35.15:6080/static/wallpaper/category/14/img242.jpg" mode="aspectFill"></image>
		<view class="desc"></view>
		<view class="desc-text">
			<view class="box-icon">...</view>
			<view class="box-text">更多</view>
		</view>
	</view>
</template>

<script setup></script>

<style scoped lang="scss">
.box-theme-item-more {
	position: relative;
	width: 223rpx;
	height: 350rpx;
	border-radius: 15rpx;
	overflow: hidden;

	.the-image {
		position: absolute;
		width: 100%;
		height: 100%;
	}

	.desc,
	.desc-text {
		position: absolute;
		z-index: 1;
		bottom: 0%;
		width: 100%;
		height: 100%;
	}

	.desc {
		background-color: rgba(0, 0, 0, 0.2);
		backdrop-filter: blur(9rpx);
	}

	.desc-text {
		font-size: 1.2em;
		color: white;
		backdrop-filter: none;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		.box-icon {
			font-size: 2.2em;
			line-height: 1em;
		}
	}
}
</style>
